<script setup lang="js">

import {ElMessage, ElMessageBox} from "element-plus";

const props = defineProps({
  message: {
    type: Object,
    required: true,
  }
})

const emits = defineEmits(['close'])

const handleSendMessage = () => {
  ElMessageBox.confirm('确定发送站内信吗？', '提示', {
    confirmButtonText: '确定',
    cancelButtonText: '取消',
    type: 'warning'
  }).then(() => {
    emits('close')
    console.log(props.message)
    ElMessage.success('发送成功！')
  }).catch(() => {
    console.log('取消发送！')
  })
}

</script>

<template>
  <el-dialog
      title="发送站内信:"
      width="30%">
    <el-form :model="message"
             ref="receiverInfoForm"
             label-width="100px">
      <el-form-item label="标题：">
        <el-input v-model="message.title" style="width: 300px" placeholder="请输入标题"></el-input>
      </el-form-item>
      <el-form-item label="内容：">
        <el-input v-model="message.content" type="textarea" rows="3" placeholder="请输入内容">
        </el-input>
      </el-form-item>
      <el-form-item>
        <el-button type="primary" @click="handleSendMessage">发送</el-button>
        <el-button @click="emits('close')">取消</el-button>
      </el-form-item>
    </el-form>
  </el-dialog>
</template>

<style scoped lang="scss">

</style>
